<template>
  <!-- 后期优化，将右侧侧边栏组件化 -->
  <div class="big-aside-container">
    <aside class="bloghome-container-right">
      <Aside class="info">
        <template #header>
          <div class="aside-header aside-fs">用户名</div>
        </template>
        <template #main>
          <div class="aside-main aside-fs">
            <span class="aside-main-item">
              <a href="#">
                <div class="aside-item-fs">文章</div>
                <div class="aside-item-number">{{ articlesCount }}</div>
              </a>
            </span>
            <span class="aside-main-item">
              <a href="#">
                <div class="aside-item-fs">分类</div>
                <div class="aside-item-number">{{ tagsCount }}</div>
              </a>
            </span>
          </div>
        </template>
        <template #footer>
          <a href="javascript:;" class="aside-footer aside-fs">撰写</a>
        </template>
      </Aside>
      <Aside class="notice">
        <template #header>
          <div class="aside-header aside-fs">简介</div>
        </template>
        <template #main>
          <div class="">欢迎参观┗|｀O′|┛ 嗷~~</div>
        </template>
      </Aside>
    </aside>
  </div>
</template>

<script>
import Aside from '@/components/Aside'
export default {
  name: 'BigAside',
  components: {
    Aside
  }
}
</script>

<style lang="less" scoped></style>
